/*
 * @Date: 2022-07-27 16:16:57
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-08-09 16:29:25
 * @FilePath: \archives-fe\src\view\sysMaintenance\TaskCronE\components\PageList.tsx
 */
import { Button, Space, Table } from 'antd';
import type { ColumnsType } from 'antd/es/table';
import EditPlan from './dialogs/EditPlan';
// import type { TableRowSelection } from 'antd/es/table/interface';
import { useEffect, useState } from 'react';
import { useTaskCronEContext } from '../contexts/TaskCronEContext';

const PageList = () => {
  const columns: ColumnsType = [
    {
      title: '序号',
      dataIndex: 'id',
      align: 'center',
      key: 'id'
    },
    {
      title: '任务名称',
      dataIndex: 'taskname',
      align: 'center',
      key: 'taskname'
    },
    {
      title: 'cron表达式',
      dataIndex: 'crone',
      align: 'center',
      key: 'crone'
    },
    {
      title: '状态',
      dataIndex: 'state',
      align: 'center',
      key: 'state'
    },
    {
      title: '描述',
      dataIndex: 'remark',
      align: 'center',
      key: 'remark'
    },
    {
      title: '操作',
      align: 'center',
      render: (_text, record: any) => (
        <Space>
          <Button
            type="link"
            size="small"
            onClick={() => {
              amend(record.id);
            }}
          >
            修改
          </Button>

          <Button
            type="link"
            size="small"
            danger
            onClick={() => {
              deleteExportFunc(record.id);
            }}
          >
            删除
          </Button>
        </Space>
      )
    }
  ];
  const { selectItems, searchList, task, SelectId, deleteExportFunc, amend, setSearch } =
    useTaskCronEContext();

  // 刷新页面用
  useEffect(() => {
    setSearch(1);
  }, [task]);
  const onSelectChange = (newSelectedRowKeys: any) => {
    console.log('selectedRowKeys changed: ', newSelectedRowKeys);
    SelectId(newSelectedRowKeys);
  };

  const rowSelection = {
    selectItems,
    onChange: onSelectChange
  };

  return (
    <>
      <Table
        rowSelection={rowSelection}
        columns={columns}
        dataSource={searchList}
        bordered
        rowKey="id"
      />
      <EditPlan />
    </>
  );
};

export default PageList;
